vue el |
您所在的位置：网站首页 › vue 上传文件到本地 › vue el |
vue el
|
vue 使用element-ui的el-upload实现上传文件到后台的功能
1.添加el-upload控件 上传 点击上传文件 data() { return { action: 'https://jsonplaceholder.typicode.com/posts/', mode: {}, modeList: [] } }:action是必不可少但是却没什么作用的 :http-request可以覆盖默认的上传方法
2.我配置的:action的值（就是官方文档示例的值） action: 'https://jsonplaceholder.typicode.com/posts/'3.:http-request函数内容，将上传成功的文件保存到mode里面，mode是自己在data里面定义的变量，初始值是mode:{} modeUpload: function(item) { // console.log(item.file); this.mode = item.file }4.上传按钮的点击事件 upload: function() { let fd = new FormData() fd.append('templateFile', this.mode) axios.post('/api/reportRule', fd, { headers: { 'Content-Type': 'multipart/form-data' } }).then(response => { console.log(response.data); }) },5.上传成功，后台可以读取到数据
|
【本文地址】